<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<!-- for-mobile-apps -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Obdurate Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
		function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- //for-mobile-apps -->
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<!-- js -->
<script src="js/jquery-1.11.1.min.js"></script>
<!-- //js -->
<!--script-->
<script src="js/jquery.chocolat.js"></script>
	<link rel="stylesheet" href="css/chocolat.css" type="text/css" media="screen" charset="utf-8">
	<!--light-box-files-->
<script type="text/javascript" charset="utf-8">
	$(function() {
		$('.banner-bottom-grd a').Chocolat();
	});
</script>
<!--script-->
<!-- start-smoth-scrolling -->
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
<script type="text/javascript">
	jQuery(document).ready(function($) {
		$(".scroll").click(function(event){		
			event.preventDefault();
			$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
		});
	});
</script>
<!-- start-smoth-scrolling -->
 
</head>
	
<body>
<!-- header-nav -->
	<div class="header-nav">
		<div class="container">
			<nav class="navbar navbar-default">
				<!-- Brand and toggle get grouped for better mobile display -->
				<div class="navbar-header">
				  <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				  </button>
					<div class="logo">
						<a class="navbar-brand" href="index.html">Obdurate <span>We are professional in our service</span></a>
					</div>
				</div>

				<!-- Collect the nav links, forms, and other content for toggling -->
				<div class="collapse navbar-collapse nav-wil" id="bs-example-navbar-collapse-1">
					<ul class="nav navbar-nav">
						<li class="active"><a href="index.html">Home</a></li>
						<li><a href="about.html">About</a></li>
						<li><a href="services.html">Services</a></li>
						<li><a href="projects.html">Projects</a></li>
						<li><a href="contact.html">Contact Us</a></li>
					</ul>
				</div><!-- /.navbar-collapse -->	
				
				<!-- search -->
				<div class="head-right">
					<div id="sb-search" class="sb-search">
						<form>
							<input class="sb-search-input" placeholder="Search" type="search" name="search" id="search">
							<input class="sb-search-submit" type="submit" value="">
							<span class="sb-icon-search"> </span>
						</form>
					</div>
				</div>
				<!-- //search -->
					<!--search-scripts-->
						<script src="js/classie.js"></script>
						<script src="js/uisearch.js"></script>
							<script>
								new UISearch( document.getElementById( 'sb-search' ) );
							</script>
					<!--//search-scripts-->
			</nav>
		</div>
	</div>
<!-- //header-nav -->
<!-- banner -->
	<div class="banner">
		<div class="container">
			<div class="banner-info">
				<h3>To take a trivial example, which of us ever undertakes</h3>
				<p>Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et 
					voluptates repudiandae sint et molestiae non recusandae.</p>
				<div class="more">
					<a href="#" class="hvr-wobble-skew">Learn More...</a>
				</div>
				<div class="banner-info-pos">
					<a href="#testimonials" class="scroll"></a>
				</div>
			</div>
		</div>
	</div>
<!-- //banner -->
<!-- banner-bottom -->
	<div class="banner-bottom">
		<div class="container">
			<div class="banner-bottom-grids">
				<div class="col-md-6 banner-bottom-grid-left">
					<h3><span class="glyphicon glyphicon-hand-right" aria-hidden="true"></span>Who We Are</h3>
					<h1>Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus.</h1>
					<p>Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et 
						voluptates repudiandae sint et molestiae non recusandae.</p>
					<div class="banner-bottom-grid-left-grids">
						<div class="sliderfig">
							<ul id="flexiselDemo1">			
								<li>
									<div class="banner-bottom-grid-left-grid">
										<h3>Leadership <span>With</span> Integrity</h3>
									</div>
								</li>
								<li>
									<div class="banner-bottom-grid-left-grid color-1">
										<h3>Focus On <span>Our</span> Clients</h3>
									</div>
								</li>
								<li>
									<div class="banner-bottom-grid-left-grid color-2">
										<h3>High <span>Quality</span> Products</h3>
									</div>
								</li>
							</ul>
						</div>
							<script type="text/javascript">
							$(window).load(function() {
								$("#flexiselDemo1").flexisel({
									visibleItems: 3,
									animationSpeed: 1000,
									autoPlay: true,
									autoPlaySpeed: 3000,    		
									pauseOnHover: true,
									enableResponsiveBreakpoints: true,
									responsiveBreakpoints: { 
										portrait: { 
											changePoint:480,
											visibleItems: 1
										}, 
										landscape: { 
											changePoint:640,
											visibleItems:3
										},
										tablet: { 
											changePoint:768,
											visibleItems: 3
										}
									}
								});
								
							});
					</script>
					<script type="text/javascript" src="js/jquery.flexisel.js"></script>
					</div>
				</div>
				<div class="col-md-6 banner-bottom-grid-right">
					<div class="col-md-6 banner-bottom-grid-left1">
						<div class="banner-bottom-grd">
							<a href="images/1.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
								<img src="images/1.jpg" alt=" " class="img-responsive" />
								<div class="textbox">
									<h4>Jan Smith</h4>
									<p>Quis autem vel eum iure reprehenderit qui in ea voluptate velit.</p>
								</div>
							</a>
						</div>
						<div class="banner-bottom-grd">
							<a href="images/2.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
								<img src="images/2.jpg" alt=" " class="img-responsive" />
								<div class="textbox">
									<h4>Joseph</h4>
									<p>Quis autem vel eum iure reprehenderit qui in ea voluptate velit.</p>
								</div>
							</a>
						</div>
					</div>
					<div class="col-md-6 banner-bottom-grid-left1 grid2">
						<div class="banner-bottom-grd">
							<a href="images/3.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
								<img src="images/3.jpg" alt=" " class="img-responsive" />
								<div class="textbox">
									<h4>Peterson</h4>
									<p>Quis autem vel eum iure reprehenderit qui in ea voluptate velit.</p>
								</div>
							</a>
						</div>
						<div class="banner-bottom-grd">
							<a href="images/4.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
								<img src="images/4.jpg" alt=" " class="img-responsive" />
								<div class="textbox">
									<h4>Micheal Buddy</h4>
									<p>Quis autem vel eum iure reprehenderit qui in ea voluptate velit.</p>
								</div>
							</a>
						</div>
					</div>
					<div class="clearfix"> </div>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
<!-- //banner-bottom -->
<!-- banner1 -->
	<div class="banner1">
		<div class="container">
			<div class="wmuSlider example1">
			    <div class="wmuSliderWrapper">
					<article style="position: absolute; width: 100%; opacity: 0;"> 
						<div class="banner-wrap">
							<div class="banner1-info">
								<div class="col-md-7 banner1-info-left">
									<h2>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h2>
									<p>To take a trivial example, which of us ever undertakes laborious physical exercise, 
										except to obtain some advantage from it</p>
									<h4>Laura Williums <span>Chief Engineer</span></h4>
								</div>
								<div class="col-md-5 banner1-info-right">
									<img src="images/2.png" alt=" " class="img-responsive" />
								</div>
								<div class="clearfix"> </div>
							</div>
						</div>
					</article>
					<article style="position: absolute; width: 100%; opacity: 0;"> 
						<div class="banner-wrap">
							<div class="banner1-info">
								<div class="col-md-7 banner1-info-left">
									<h2>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h2>
									<p>To take a trivial example, which of us ever undertakes laborious physical exercise, 
										except to obtain some advantage from it</p>
									<h4>Arun Duttha <span>Chief Engineer</span></h4>
								</div>
								<div class="col-md-5 banner1-info-right">
									<img src="images/4.png" alt=" " class="img-responsive" />
								</div>
								<div class="clearfix"> </div>
							</div>
						</div>
					</article>
					<article style="position: absolute; width: 100%; opacity: 0;"> 
						<div class="banner-wrap">
							<div class="banner1-info">
								<div class="col-md-7 banner1-info-left">
									<h2>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h2>
									<p>To take a trivial example, which of us ever undertakes laborious physical exercise, 
										except to obtain some advantage from it</p>
									<h4>Rupachick <span>Chief Engineer</span></h4>
								</div>
								<div class="col-md-5 banner1-info-right">
									<img src="images/5.png" alt=" " class="img-responsive" />
								</div>
								<div class="clearfix"> </div>
							</div>
						</div>
					</article>
				</div>
			</div>
					<script src="js/jquery.wmuSlider.js"></script> 
					  <script>
						$('.example1').wmuSlider();         
					 </script> 
		</div>
	</div>
<!-- //banner1 -->
<!-- banner1-bottom -->
	<div class="banner1-bottom">
		<div class="container">
			<div class="banner1-bottom-grids">
				<div class="col-md-2 banner1-bottom-grids1">
					<h3><span class="glyphicon glyphicon-user" aria-hidden="true"></span> Our Clients</h3>
				</div>
				<div class="col-md-2 banner1-bottom-grids1 banner1-bottom-grids1-color">
					<h3><span class="glyphicon glyphicon-star" aria-hidden="true"></span> Quality</h3>
				</div>
				<div class="col-md-2 banner1-bottom-grids1 banner1-bottom-grids1-color1">
					<h3><span class="glyphicon glyphicon-signal" aria-hidden="true"></span> Graph</h3>
				</div>
				<div class="col-md-2 banner1-bottom-grids1 banner1-bottom-grids1-color2">
					<h3><span class="glyphicon glyphicon-lock" aria-hidden="true"></span> Workers</h3>
				</div>
				<div class="col-md-2 banner1-bottom-grids1 banner1-bottom-grids1-color3">
					<h3><span class="glyphicon glyphicon-tint" aria-hidden="true"></span> Address</h3>
				</div>
				<div class="col-md-2 banner1-bottom-grids1 banner1-bottom-grids1-color4">
					<h3><span class="glyphicon glyphicon-calendar" aria-hidden="true"></span> Date</h3>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
<!-- //banner1-bottom -->
<!-- newsletter -->
	<div class="newsletter">
		<div class="container">
			<div class="newsletter-left">
				<span></span>
			</div>
			<div class="newsletter-right">
				<h3>Newsletter<span class="glyphicon glyphicon-hand-left" aria-hidden="true"></span></h3>
				<p>Voluptatibus maiores alias consequatur aut perferendis doloribus 
					asperiores molestiae non recusandae. Itaque earum rerum hic tenetur.</p>
				<form>
					<input type="text" value="Your email address" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Your email address';}" required="">
					<input type="submit" value="Sign up">
					<div class="clearfix"> </div>
				</form>
			</div>
			<div class="clearfix"> </div>
			<div class="call-us">	
				<span class="glyphicon glyphicon-earphone" aria-hidden="true"></span>
				<h3>Contact Us :<span>+0809 657 890</span></h3>
			</div>
		</div>
	</div>
<!-- //newsletter -->
<!-- testimonials -->
	<div class="testimonials" id="testimonials">
		<div class="container">
			<h3><span class="glyphicon glyphicon-hand-right" aria-hidden="true"></span>Testimonials</h3>
			<div class="testimonials-grids">
				<div class="col-md-6 testimonials-grid">
					<div class="col-md-8 testimonials-grd">
						<div class="testimonials-grid1">
							<h4>Dollyfrick <span>Engineer</span></h4>
							<p>Voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum 
								fugiat quo voluptas nulla pariatur</p>
						</div>
					</div>
					<div class="col-md-4 testimonials-grd-right">
						<img src="images/6.png" alt=" " class="img-responsive" />
					</div>
					<div class="clearfix"> </div>
				</div>
				<div class="col-md-6 testimonials-grid">
					<div class="col-md-4 testimonials-grd-right">
						<img src="images/9.png" alt=" " class="img-responsive" />
					</div>
					<div class="col-md-8 testimonials-grd">
						<div class="testimonials-grid1 testimonials-grid1-second">
							<h4>Jamescam <span>Engineer</span></h4>
							<p>Voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum 
								fugiat quo voluptas nulla pariatur</p>
						</div>
					</div>
					<div class="clearfix"> </div>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
<!-- //testimonials -->
<!-- footer -->
	<div class="footer">
		<div class="container">
			<div class="footer-grids">
				<div class="col-md-4 footer-grid">
					<div class="footer-logo">
						<a href="index.html">Obdurate <span>We are professional in our service</span></a>
					</div>
				</div>
				<div class="col-md-4 footer-grid">
					<h4>Call Us <span>+0809 657 890</span></h4>
					<p>My Company,875 jewel Road <span>8907 Ukrain.</span></p>
					<ul class="social-icons">
						<li><a href="#" class="p"> </a></li>
						<li><a href="#" class="facebook"> </a></li>
						<li><a href="#" class="twitter"> </a></li>
						<li><a href="#" class="in"> </a></li>
					</ul>
				</div>
				<div class="col-md-4 footer-grid">
					<ul>
						<li><a href="index.html">Home</a></li>
						<li><a href="about.html">About</a></li>
						<li><a href="services.html">Services</a></li>
						<li><a href="projects.html">Projects</a></li>
						<li><a href="contact.html">Contact Us</a></li>
					</ul>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
	<div class="footer-copy">
		<div class="container">
			<p>Copyright &copy; 2016.Company name All rights reserved.<a target="_blank" href="http://www.freemoban.com/">www.freemoban.com</a></p>
		</div>
	</div>
<!-- //footer -->
<!-- for bootstrap working -->
	<script src="js/bootstrap.js"></script>
<!-- //for bootstrap working -->
<!-- here stars scrolling icon -->
	<script type="text/javascript">
		$(document).ready(function() {
			/*
				var defaults = {
				containerID: 'toTop', // fading element id
				containerHoverID: 'toTopHover', // fading element hover id
				scrollSpeed: 1200,
				easingType: 'linear' 
				};
			*/
								
			$().UItoTop({ easingType: 'easeOutQuart' });
								
			});
	</script>
<!-- //here ends scrolling icon -->
</body>
</html>